<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <!-- 导入vue -->
    <script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.9/vue.js"></script>
    <!-- 导入js -->
    <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.0/axios.js"></script>

</head>
<body>
    <!-- 1.点击登录按钮，请求登录接口，获取token -->
    <div id="app">
       <button @click = 'login'>登录</button>
       
       <button @click = 'findAll'>查询文章</button>

    </div>
    <script>
        // 添加请求拦截器
        axios.interceptors.request.use(function (config) {
        // 在发送请求之前做些什么
        // console.log(config.haeders,'---------');
        config.haeders['Authorization'] = 'localStorage.setItem('token')';
        return config;
        }, function (error) {
        // 对请求错误做些什么
        return Promise.reject(error);
        });

        // 添加响应拦截器
        axios.interceptors.response.use(function (response) {
        // 对响应数据做点什么
        return response;
        }, function (error) {
        // 对响应错误做点什么
        return Promise.reject(error);
        });
        new Vue({
            el:'#app',
            data(){
                return{

                }
            },
            methods:{
                login(){
                    // 1.封装参数
                    var obj = {
                        password:123321,
                        username:'admin'
                    }
                    // 2.发送网络请求
                    axios({
                        url:'http://39.107.221.142:8001/user/login',
                        method:'post',
                        // data(method是post时)/params
                        data:obj
                    }).then((res)=>{
                        console.log(res.data.data.token);
                        localStorage.setItem('token',res.data.data.token)
                    })
                    // .catch()
                },
                findAll(){
                    axios({
                        url:'http://39.107.221.142:8001/article/findAll',
                        methods:'get'
                    })
                }
            }
        })
    </script>
</body>
</html>